<template>
		<div>
			<van-pull-refresh v-model="loading" @refresh="onRefresh">
			<van-row justify="center">
				<van-col span="1">
				</van-col>
				<van-col span="18">
				<div>
					<van-nav-bar 
					title="儿科中心" 
					left-arrow
					@click-left="onClickLeft"
					  >
							  <template #right>
								<div>
									<van-cell icon= "weapp-nav" @click="showShare = true" />
									<van-share-sheet
									  v-model:show="showShare"
									  title="立即分享"
									  :options="options"
									  @select="onSelect"
									/>
								</div>
							  </template>
					</van-nav-bar>
					
				</div>
				
				<div style="margin-top:0.0625rem;border:1.2px solid #F0F8FF">
					<div>
						<img class="tpceshi" alt="Vue QD" src="../assets/QQ.png"/>
					</div>
					<div>
						<img class="tpceshe" alt="Vue QD" src="../assets/DA.png"/>
					</div>
					
					<div style="margin-top:0.0625rem;border:1.2px solid #F0F8FF">
					<!-- 文字较短时，通过设置 scrollable 属性开启滚动播放 -->
					<van-notice-bar scrollable text="24小时专业问诊看诊,需要者请直接联系000-00000000" />
					</div>
					
				</div>
				<div>
					<div style="float: left;font-size: 1.2rem;font-weight: bolder;">
						<van-button type="primary">
							<h3>
								【急诊图文】
							</h3>
							<h3></h3>
							</van-button>
						</div>
						
						<div style="text-align: right;font-size: 1.2rem;font-weight: bolder;">
							<van-button type="primary">
							<h3>
								【急诊电话】
							</h3>

							</van-button>
						</div>
					
				</div>
				
				<div style="margin-top: 0.0625rem;border:1.2px solid #F0F8FF">
					<div>
						<van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
						  <van-swipe-item>
							<div>
							<img src="../assets/in/image.png"/>
							</div>
						  </van-swipe-item>
						  <van-swipe-item>
							  <div>
							  <img src="../assets/in/image2.png"/>
							  </div>
						  </van-swipe-item>
						  <van-swipe-item>
							  <div>
							  <img src="../assets/in/image1.png"/>
							  </div>
						  </van-swipe-item>
						  <van-swipe-item>
							  <div>
							  <img src="../assets/in/image3.png"/>
							  </div>
						  </van-swipe-item>
						</van-swipe>
					</div>
				</div>
				<div style="margin-top:0.0625rem;border:1.2px solid #F0F8FF">
					<div>
						<h1>
							ssssssssssssssssss
						</h1>
					</div>
				</div>
				
				</van-col>
				<van-col span="1">
				</van-col>
			</van-row>
			</van-pull-refresh>
		</div>
</template>

<script>
	import {ref } from 'vue';
	import { Toast } from 'vant';
	export default {
	  setup() {
	    const showShare = ref(false);
	    const options = [
	      { name: '微信', icon: 'wechat' },
	      { name: '微博', icon: 'weibo' },
	      { name: '复制链接', icon: 'link' },
	      { name: '分享海报', icon: 'poster' },
	      { name: '二维码', icon: 'qrcode' },
	    ];
	    const onSelect = (option) => {
	      Toast(option.name);
	      showShare.value = false;
	    };
		const onClickLeft = () => history.back();
		const count = ref(0);
		const loading = ref(false);
		const onRefresh = () => {
		      setTimeout(() => {
		        Toast('刷新成功');
		        loading.value = false;
		        count.value++;
		      }, 1000);
		    };
		// const images = [
		// 	      'https://img.yzcdn.cn/vant/apple-1.jpg',
		// 	      'https://img.yzcdn.cn/vant/apple-2.jpg',
		// 	    ];
	
	    return {
	      options,
	      onSelect,
	      showShare,
		  count,
		  loading,
		  onRefresh,
		  // images,
		  onClickLeft,

	    };
	  },
	};

</script>

<style>
	.tpceshi{
		width: 100%;
		height: 200px;
}
	/* .imgss{
		width: 100%;
		height: 120px;
} */
.my-swipe .van-swipe-item {
    color: #fff;
    font-size: 20px;
    line-height: 4px;
    text-align: center;
    background-color: #ffffff;
}
	.tpceshe{
		width: 100%;
		height: 50px
	}

</style>
